<template>
  <div>
    <div>
      <h2>审核通过订单</h2>
    </div>
    <!-- 表格渲染 -->
    <el-table
      border
      :fit="true"
      ref="tableData"
      max-height="750"
      style="width: 100%"
      :data="tableData"
    >
      <el-table-column type="index" label="序号" width="60"></el-table-column>
      <el-table-column prop="u_id" v-if="false"></el-table-column>
      <el-table-column prop="order_id" label="订单号"></el-table-column>
      <el-table-column prop="orderStatus" label="状态" :formatter="orderStatus"></el-table-column>

      <el-table-column prop="orderTime" label="订单时间" width="160"></el-table-column>
      <el-table-column prop="arrireDate" label="到达时间" width="160"></el-table-column>
      <el-table-column prop="leaveDate" label="离开时间" width="160"></el-table-column>
      <el-table-column prop="realMoney" label="实收（元）"></el-table-column>
      <el-table-column prop="orderMoney" label="定价（元）"></el-table-column>
      <el-table-column prop="userPhone" label="手机号" width="170"></el-table-column>
      <el-table-column prop="user_remark" label="用户备注"></el-table-column>
      <el-table-column prop="admin_remark" label="备注"></el-table-column>
      <el-table-column fixed="right" label="操作" width="300">
        <template slot-scope="scope">
          <el-button
            size="medium"
            type="text"
            @click="arrangeRoom(scope.$index,scope.row)"
            :disabled="scope.row.checkInVisible"
          >安排房间</el-button>
          <el-button
            size="medium"
            type="text"
            @click="deleteOrder_Room(scope.$index,scope.row)"
            :disabled="scope.row.roomNumber==1"
          >用户取消一个订单房间</el-button>
          <el-button
            size="medium"
            type="text"
            :disabled="scope.row.changRoomVisible"
            @click="orderCancelByAdmin(scope.$index,scope.row)"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-dialog title="安排房间" :visible.sync="dialogVisible" width="30%" center>
      <div>
        <div v-if="this.roomNum > 0">
          <div>
            <a-form-item label="安排房间一">
              <el-select v-model="room1">
                <el-option
                  v-for="(item) in setOption"
                  :key="item.id"
                  :value="item.value"
                  v-if="item.value == room1 || !selected.includes(item.value)"
                ></el-option>
              </el-select>
            </a-form-item>
          </div>
          <div v-if="this.roomNum > 1">
            <div>
              <a-form-item label="安排房间二">
                <el-select v-model="room2">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room2 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 2">
            <div>
              <a-form-item label="安排房间三">
                <el-select v-model="room3">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room3 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 3">
            <div>
              <a-form-item label="安排房间四">
                <el-select v-model="room4">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room4 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>

          <div v-if="this.roomNum > 4">
            <div>
              <a-form-item label="安排房间五">
                <el-select v-model="room5">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room5 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 5">
            <div>
              <a-form-item label="安排房间六">
                <el-select v-model="room6">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room6 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 6">
            <div>
              <a-form-item label="安排房间七">
                <el-select v-model="room7">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room7 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 7">
            <div>
              <a-form-item label="安排房间八">
                <el-select v-model="room8">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room8 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 8">
            <div>
              <a-form-item label="安排房间九">
                <el-select v-model="room9">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room9 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div v-if="this.roomNum > 9">
            <div>
              <a-form-item label="安排房间十">
                <el-select v-model="room10">
                  <el-option
                    v-for="(item) in setOption"
                    :key="item.id"
                    :value="item.value"
                    v-if="item.value == room10 || !selected.includes(item.value)"
                  ></el-option>
                </el-select>
              </a-form-item>
            </div>
          </div>
          <div>
            <el-button type="primary" @click="pushRoom">提交</el-button>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="text" @click="dialogVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableData: [],
      searchData: [], //订单房间
      room_id_total: [],
      Option: [],
      setOption: [],
      dialogVisible: false,
      roomNum: "",
      order_id: "",
      listQuery: {
        rt_id: "",
        status: 1
      },
      rooms: [],
      room1: "",
      room2: "",
      room3: "",
      room4: "",
      room5: "",
      room6: "",
      room7: "",
      room8: "",
      room9: "",
      room10: "",
      addRoom: {
        order_id: "",
        order_Rooms: []
        // order_id:10021,
        // order_Rooms:[{or_room_id:22, room_id:103,rt_id:1}]
      }
    };
  },
  computed: {
    selected() {
      return [
        this.room1,
        this.room2,
        this.room3,
        this.room4,
        this.room5,
        this.room6,
        this.room7,
        this.room8,
        this.room9,
        this.room10
      ];
    }
  },
  mounted() {
    this.getOrderByStatus1();
  },
  methods: {
    orderStatus(row) {
          console.log(row);
          if (row.orderStatus == 0) {
              row.Status = "未审核";
              return row.Status;
          } else if (row.orderStatus == 1) {
              row.Status = "审核通过";
              return row.Status;
          } else if (row.orderStatus == 2) {
              row.Status = "已入住";
              return row.Status;
          } else if (row.orderStatus == -1) {
              row.Status = "用户取消订单";
              return row.Status;
          } else if (row.orderStatus == -2) {
              row.Status = "拒绝";
              return row.Status;
          }
      },
    change(e) {
      this.$forceUpdate(e);
    },
    pushRoom() {
      this.rooms = [];
      this.addRoom.order_Rooms = [];
      if (this.roomNum > 0) this.rooms.push(this.room1);
      if (this.roomNum > 1) this.rooms.push(this.room2);
      if (this.roomNum > 2) this.rooms.push(this.room3);
      if (this.roomNum > 3) this.rooms.push(this.room4);
      if (this.roomNum > 4) this.rooms.push(this.room5);
      if (this.roomNum > 5) this.rooms.push(this.room6);
      if (this.roomNum > 6) this.rooms.push(this.room7);
      if (this.roomNum > 7) this.rooms.push(this.room8);
      if (this.roomNum > 8) this.rooms.push(this.room9);
      if (this.roomNum > 9) this.rooms.push(this.room10);
      console.log(this.rooms);
      console.log(this.room_id_total);
      this.addRoom.order_id = this.order_id;
      for (var i = 0; i < this.roomNum; i++) {
        let input = {
          or_room_id: this.room_id_total[i].or_room_id,
          room_id: this.rooms[i],
          rt_id: this.room_id_total[i].rt_id
        };
        this.addRoom.order_Rooms.push(input);
      }
      var data = JSON.stringify(this.addRoom);
      console.log(data);
      this.$axios({
        method: "POST",
        url: "/ssms/admin/order/userInHotel",
        headers: {
          "Content-Type": "application/json"
        },
        responseType: "application/json",
        data: data
        // emailCode:this.formInline.emailCode
      })
        .then(response => {
          console.log(response.data);
          if (response.data.code === 0) {
            alert("成功");
            this.dialogVisible = false;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    searchAndSetOption() {
      this.getRoom();

      this.setOption = [];
      // for (var i = 0; i < this.searchData.length; i++) {
      //   let option = { id: i, value: this.searchData[i].room_id };
      //   this.setOption.push(option);
      // }
      console.log(this.setOption);
    },
    getRoom() {
      var data = JSON.stringify(this.listQuery);
      console.log(data);
      this.$axios({
        method: "POST",
        url: "/ssms/admin/room/getRoomBtStatusRt_id",
        headers: {
          "Content-Type": "application/json"
        },
        responseType: "application/json",
        data: data
        // emailCode:this.formInline.emailCode
      })
        .then(response => {
          console.log(response.data);
          if (response.data.code === 0) {
            this.searchData = response.data.obj;
            // console.log(this.searchData);
            for (var i = 0; i < this.searchData.length; i++) {
              let option = { id: i, value: this.searchData[i].room_id };
              this.setOption.push(option);
            }
            //console.log(this.setOption);
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    getOrderByStatus1() {
      this.$axios
        .get("/ssms/admin/order/getOrderByStatus?orderStatus=1", {
          headers: {
            "Content-Type": "application/json",
            responseType: "application/json"
          }
        })
        .then(res => {
          console.log(res.data);
          if (res.data.code === 0) {
            this.tableData = res.data.obj;
          }
        });
    },
    arrangeRoom(index, row) {
      this.roomNum = row.roomNumber;
      this.order_id = row.order_id;

      this.rooms = [];
      // for(var i = 0; i < this.roomNum; i++){
      //   let input = {or_room_id:22, room_id:103,rt_id:1};
      // }
      this.$axios({
        method: "POST",
        url: "/ssms/admin/order/findAllOrderRoom?order_id=" + this.order_id,
        headers: {
          "Content-Type": "application/json"
        },
        responseType: "application/json"
        // emailCode:this.formInline.emailCode
      })
        .then(response => {
          console.log("response.data");
          console.log(response.data);
          if (response.data.code === 0) {
            let FindsearchData = response.data.obj;
            this.room_id_total = response.data.obj;
            this.roomNum = this.room_id_total.length;
            row.roomNumber = this.roomNum;
            console.log("room_id_total:");
            console.log(this.roomNum);
            console.log("FindsearchData.data");
            console.log(FindsearchData);
            this.listQuery.rt_id = FindsearchData[0].rt_id;
            console.log("rt_id:" + this.listQuery.rt_id);
            this.searchAndSetOption();
          }
        })
        .catch(err => {
          console.log(err);
        });

      console.log(this.roomNum);
      this.dialogVisible = true;
    },
    deleteOrder_Room(index, row) {
      this.$axios({
        method: "POST",
        url: "/ssms/admin/order/findAllOrderRoom?order_id=" + row.order_id,
        headers: {
          "Content-Type": "application/json"
        },
        responseType: "application/json"
        // emailCode:this.formInline.emailCode
      })
        .then(response => {
          console.log("response.data");
          console.log(response.data);
          if (response.data.code === 0) {
            let room_id_total = response.data.obj;
            console.log(room_id_total);
             let delete_or_room_id = room_id_total[0].or_room_id;
            let delete_order_id = room_id_total[0].order_id;
            let delete_rt_id = room_id_total[0].rt_id;
            let delete_out_date = room_id_total[0].out_date;
            let delete_in_date = room_id_total[0].in_date;
            console.log(delete_or_room_id);
            this.$axios
              .get(
                "/ssms/admin/order/deleteOrder_Room",
                {
                  params: {
                    or_room_id: delete_or_room_id,
                    order_id: delete_order_id,
                    rt_id: delete_rt_id,
                    in_date:delete_in_date,
                    out_date: delete_out_date
                  }
                },
                {
                  headers: {
                    "Content-Type": "application/json",
                    responseType: "application/json"
                  }
                }
              )
              .then(res => {
                console.log(res.data);
                if (res.data.code === 0) {
                  alert(res.data.msg);
                } else {
                  alert(res.data.msg);
                }
              });
          }
        })
        .catch(err => {
          console.log(err);
          alert(res.data.obj);
        });
    },
    orderCancelByAdmin(index, row) {
      this.$axios
        .get("/ssms/admin/order/orderCancelByAdmin?order_id=" + row.order_id, {
          headers: {
            "Content-Type": "application/json",
            responseType: "application/json"
          }
        })
        .then(res => {
          console.log(res.data);
          if (res.data.code === 0) {
            alert(res.data.msg);
          } else {
            alert(res.data.msg);
          }
        });
    }
  }
};
</script>

<style>
</style>
